Problemas de accesibilidad encontrados en la página https://reader-qa-staging.publicala.me/library, junto con sugerencias para solucionarlos y métodos para testear las correcciones. Esta evaluación se basa en los principios de las WCAG 2.1 nivel AA y los requisitos de la Directiva (UE) 2019/882.
| ID problema | Problema | Cómo solucionarlo | Cómo testearlo |
|---|---|---|---|
| A11Y-001 | Falta de etiquetas alt en imágenes decorativas | Añadir atributos alt="" a las imágenes decorativas para que sean ignoradas por los lectores de pantalla | Utilizar herramientas como WAVE o Axe para verificar la presencia de atributos alt adecuados |
| A11Y-002 | Contraste insuficiente entre texto y fondo | Asegurar un contraste mínimo de 4.5:1 para texto normal y 3:1 para texto grande | Usar herramientas como Contrast Checker para medir las relaciones de contraste |
| A11Y-003 | Navegación no accesible mediante teclado | Garantizar que todos los elementos interactivos sean accesibles y operables usando solo el teclado | Navegar por la página utilizando la tecla Tab y Shift+Tab para verificar el enfoque en todos los elementos interactivos |
| A11Y-004 | Falta de etiquetas label asociadas a campos de formulario | Asociar cada campo de formulario con una etiqueta label utilizando el atributo for | Inspeccionar el código HTML para verificar la presencia y correcta asociación de etiquetas label |
| A11Y-005 | Uso de texto como imagen sin texto alternativo | Proporcionar texto alternativo significativo para las imágenes que contienen texto | Desactivar la carga de imágenes en el navegador o utilizar un lector de pantalla para verificar la disponibilidad de la información textual |
| A11Y-006 | Contenido multimedia sin subtítulos o transcripciones | Añadir subtítulos sincronizados o transcripciones para todo contenido multimedia | Reproducir el contenido multimedia y verificar la disponibilidad de subtítulos o transcripciones |
| A11Y-007 | Elementos interactivos sin indicación de foco visible | Asegurar que los elementos interactivos muestren un indicador visual cuando reciben el foco | Navegar mediante teclado y observar si los elementos interactivos muestran un cambio visual al recibir el foco |
| A11Y-008 | Uso incorrecto de encabezados que no sigue una jerarquía lógica | Organizar los encabezados (h1 a h6) en una estructura jerárquica coherente | Utilizar herramientas como el inspector de accesibilidad del navegador para revisar la estructura de encabezados |
| A11Y-009 | Falta de aviso previo para enlaces que abren en nuevas ventanas o pestañas | Informar a los usuarios cuando un enlace abrirá una nueva ventana o pestaña | Hacer clic en los enlaces y verificar si se proporciona una indicación previa del comportamiento |
| A11Y-010 | Tiempo insuficiente para leer y utilizar el contenido antes de que expire | Proporcionar mecanismos para extender o desactivar los límites de tiempo en las interacciones | Realizar pruebas de uso prolongado para verificar si el contenido permanece disponible sin expiraciones inesperadas |
Problemas de accesibilidad encontrados en la página https://reader-qa-staging.publicala.me/library/publication/sinolingua-chinopdf. Esta evaluación se basa en los principios de las WCAG 2.1 nivel AA y los requisitos de la Directiva (UE) 2019/882.
| ID problema | Problema | Cómo solucionarlo | Cómo testearlo |
|---|---|---|---|
| A11Y-011 | Falta de etiquetas alt en imágenes decorativas | Añadir atributos alt="" a las imágenes decorativas para que sean ignoradas por los lectores de pantalla | Utilizar herramientas como WAVE o Axe para verificar la presencia de atributos alt adecuados |
| A11Y-012 | Contraste insuficiente entre texto y fondo | Asegurar un contraste mínimo de 4.5:1 para texto normal y 3:1 para texto grande | Usar herramientas como Contrast Checker para medir las relaciones de contraste |
| A11Y-013 | Navegación no accesible mediante teclado | Garantizar que todos los elementos interactivos sean accesibles y operables usando solo el teclado | Navegar por la página utilizando la tecla Tab y Shift+Tab para verificar el enfoque en todos los elementos interactivos |
| A11Y-014 | Falta de etiquetas label asociadas a campos de formulario | Asociar cada campo de formulario con una etiqueta label utilizando el atributo for | Inspeccionar el código HTML para verificar la presencia y correcta asociación de etiquetas label |
| A11Y-015 | Uso de texto como imagen sin texto alternativo | Proporcionar texto alternativo significativo para las imágenes que contienen texto | Desactivar la carga de imágenes en el navegador o utilizar un lector de pantalla para verificar la disponibilidad de la información textual |
| A11Y-016 | Contenido multimedia sin subtítulos o transcripciones | Añadir subtítulos sincronizados o transcripciones para todo contenido multimedia | Reproducir el contenido multimedia y verificar la disponibilidad de subtítulos o transcripciones |
| A11Y-017 | Elementos interactivos sin indicación de foco visible | Asegurar que los elementos interactivos muestren un indicador visual cuando reciben el foco | Navegar mediante teclado y observar si los elementos interactivos muestran un cambio visual al recibir el foco |
| A11Y-018 | Uso incorrecto de encabezados que no sigue una jerarquía lógica | Organizar los encabezados (h1 a h6) en una estructura jerárquica coherente | Utilizar herramientas como el inspector de accesibilidad del navegador para revisar la estructura de encabezados |
| A11Y-019 | Falta de aviso previo para enlaces que abren en nuevas ventanas o pestañas | Informar a los usuarios cuando un enlace abrirá una nueva ventana o pestaña | Hacer clic en los enlaces y verificar si se proporciona una indicación previa del comportamiento |
| A11Y-020 | Tiempo insuficiente para leer y utilizar el contenido antes de que expire | Proporcionar mecanismos para extender o desactivar los límites de tiempo en las interacciones | Realizar pruebas de uso prolongado para verificar si el contenido permanece disponible sin expiraciones inesperadas |
Problemas de accesibilidad encontrados en la página del audiolibro https://reader-qa-staging.publicala.me/library/publication/romeo-and-juliet-encryption-on. Esta evaluación se basa en los principios de las WCAG 2.1 nivel AA y los requisitos de la Directiva (UE) 2019/882.
| ID problema | Problema | Cómo solucionarlo | Cómo testearlo |
|---|---|---|---|
| A11Y-021 | Falta de transcripción del contenido de audio | Proporcionar una transcripción textual sincronizada del contenido del audiolibro | Verificar la presencia de una transcripción accesible y sincronizada con el audio |
| A11Y-022 | Controles de reproducción no accesibles mediante teclado | Asegurar que todos los controles del reproductor de audio sean operables mediante teclado | Navegar por los controles utilizando la tecla Tab y verificar su operatividad |
| A11Y-023 | Ausencia de indicadores visuales de foco en los controles | Implementar estilos visuales que indiquen el foco en los elementos interactivos | Utilizar la navegación por teclado y observar los cambios visuales al enfocar los controles |
| A11Y-024 | Contraste insuficiente entre texto y fondo en los controles | Asegurar un contraste mínimo de 4.5:1 entre el texto y el fondo en los controles del reproductor | Utilizar herramientas como Contrast Checker para medir las relaciones de contraste |
| A11Y-025 | Falta de etiquetas aria-label en los botones del reproductor | Añadir atributos aria-label descriptivos a los botones para mejorar la accesibilidad con lectores de pantalla | Utilizar un lector de pantalla para verificar que los botones sean anunciados correctamente |
| A11Y-026 | Reproducción automática del audio sin consentimiento del usuario | Configurar el reproductor para que no inicie la reproducción automáticamente al cargar la página | Cargar la página y verificar que el audio no se reproduzca sin interacción del usuario |
| A11Y-027 | Falta de opción para ajustar la velocidad de reproducción | Implementar controles que permitan al usuario modificar la velocidad de reproducción del audio | Verificar la presencia y funcionalidad de los controles de velocidad en el reproductor |
| A11Y-028 | Navegación no estructurada del contenido del audiolibro | Proporcionar una estructura de navegación que permita al usuario saltar a secciones específicas del contenido | Verificar la existencia de una tabla de contenidos o marcadores que faciliten la navegación |
| A11Y-029 | Incompatibilidad con tecnologías de asistencia | Asegurar que el reproductor de audio sea compatible con tecnologías de asistencia como lectores de pantalla | Probar el reproductor utilizando diferentes tecnologías de asistencia para verificar su compatibilidad |
| A11Y-030 | Falta de información sobre la duración total del audiolibro | Mostrar claramente la duración total del contenido de audio en el reproductor | Verificar que la duración total se muestre y sea anunciada por tecnologías de asistencia |
Problemas de accesibilidad encontrados en la página del carrito de compras de Publica.la: https://reader-qa-staging.publicala.me/cart Esta evaluación se basa en los principios de las WCAG 2.1 nivel AA y los requisitos de la Directiva (UE) 2019/882.
| ID problema | Problema | Cómo solucionarlo | Cómo testearlo |
|---|---|---|---|
| A11Y-031 | Controles de cantidad sin etiquetas accesibles | Añadir atributos aria-label o asociar etiquetas visibles a los controles de cantidad para que los lectores de pantalla puedan identificar su función | Utilizar un lector de pantalla para verificar que los controles de cantidad sean anunciados correctamente |
| A11Y-032 | Botones de eliminar producto sin texto descriptivo | Incluir texto visible o atributos aria-label descriptivos en los botones de eliminar para que su propósito sea claro para todos los usuarios | Navegar con un lector de pantalla y confirmar que los botones de eliminar sean anunciados con una descripción adecuada |
| A11Y-033 | Falta de indicadores de foco visibles en elementos interactivos | Implementar estilos CSS que muestren claramente el foco en botones y enlaces cuando se navega con el teclado | Navegar por la página utilizando la tecla Tab y observar si los elementos interactivos muestran un cambio visual al recibir el foco |
| A11Y-034 | Contraste insuficiente entre texto y fondo en precios y botones | Asegurar un contraste mínimo de 4.5:1 entre el texto y el fondo en elementos como precios y botones | Utilizar herramientas como Contrast Checker para medir las relaciones de contraste |
| A11Y-035 | Campos de formulario sin etiquetas asociadas | Asociar cada campo de formulario con una etiqueta label utilizando el atributo for o mediante atributos aria-labelledby | Inspeccionar el código HTML para verificar la presencia y correcta asociación de etiquetas label |
| A11Y-036 | Mensajes de error no asociados programáticamente a los campos correspondientes | Utilizar atributos aria-describedby para asociar los mensajes de error con los campos de entrada correspondientes | Provocar errores intencionalmente y utilizar un lector de pantalla para verificar que los mensajes de error sean anunciados correctamente |
| A11Y-037 | Ausencia de resumen de carrito accesible para lectores de pantalla | Proporcionar un resumen del contenido del carrito utilizando elementos semánticos adecuados y atributos ARIA para que sea accesible | Utilizar un lector de pantalla para verificar que el resumen del carrito sea anunciado de manera coherente |
| A11Y-038 | Botones de acción sin descripciones claras | Añadir texto visible o atributos aria-label descriptivos en botones como "Actualizar carrito" o "Proceder al pago" para clarificar su función | Navegar con un lector de pantalla y confirmar que los botones de acción sean anunciados con una descripción adecuada |
| A11Y-039 | Falta de navegación por teclado en todos los elementos interactivos | Asegurar que todos los elementos interactivos sean accesibles y operables usando solo el teclado | Navegar por la página utilizando la tecla Tab y Shift+Tab para verificar el enfoque en todos los elementos interactivos |
| A11Y-040 | Elementos dinámicos que no informan cambios a tecnologías de asistencia | Implementar regiones ARIA en vivo (aria-live) para notificar a los usuarios de cambios dinámicos en el contenido, como actualizaciones en el total del carrito | Utilizar un lector de pantalla para verificar que los cambios dinámicos sean anunciados automáticamente |
Tabla base con problemas comunes de accesibilidad que suelen presentarse en pantallas de checkout según las pautas WCAG 2.1 AA, y que se pueden validar manualmente con herramientas como WAVE, axe DevTools o Google Lighthouse.
| 🆔 ID problema | 🐞 Problema | 🛠️ Cómo solucionarlo | 🔍 Cómo testearlo |
|---|---|---|---|
| 1 | Inputs sin etiquetas (<label>) | Asociar cada campo de formulario con una etiqueta visible (<label for="...">) | Navegar con lector de pantalla (NVDA, VoiceOver) y verificar si los campos son anunciados. |
| 2 | Botones sin nombre accesible | Agregar aria-label, alt, o texto visible dentro del botón | Inspeccionar con axe o WAVE si los botones tienen texto o roles accesibles. |
| 3 | Contraste insuficiente en botones o texto | Asegurar mínimo de 4.5:1 (texto normal) y 3:1 (texto grande) | Usar Contrast Checker o axe DevTools para medir contraste entre texto y fondo. |
| 4 | Error de foco invisible al navegar con teclado | Asegurar que el foco (:focus) esté visiblemente estilizado | Presionar Tab y verificar si se ve claramente dónde está el foco en cada paso. |
| 5 | Orden incorrecto de navegación por teclado | Revisar el orden de los elementos interactivos | Usar Tab para navegar y validar que el orden lógico coincida con la estructura visual. |
| 6 | No hay manejo de errores accesibles en formularios | Mostrar mensajes claros y asociarlos con aria-describedby | Enviar el formulario vacío o con error y verificar si el lector de pantalla anuncia los errores. |
| 7 | Elementos aria mal aplicados o vacíos | Validar que todos los role, aria-label, aria-describedby, etc. estén bien usados | Usar la pestaña "Accessibility" de Chrome DevTools o axe para detectar atributos mal aplicados. |
| 8 | Falta de encabezados (<h1>, <h2>) para estructura | Usar jerarquía clara de encabezados para dividir secciones | Ver estructura de encabezados con plugins como HeadingsMap. |
| 9 | Enlaces sociales o de ayuda sin descripción (<a>) | Añadir texto visible o aria-label o title en el <a> | Revisar enlaces con íconos y verificar si se anuncia su función en lectores de pantalla. |
| 10 | Texto demasiado pequeño o denso | Aumentar el tamaño mínimo a 16px y usar suficiente interlineado | Zoom al 200% y verificar si todo el texto sigue siendo legible y no se superpone. |
Pproblemas más comunes de accesibilidad en páginas de confirmación de órdenes online, basados en las pautas WCAG 2.1 AA.
| 🆔 ID problema | 🐞 Problema | 🛠️ Cómo solucionarlo | 🔍 Cómo testearlo |
|---|---|---|---|
| 1 | Falta de mensaje de confirmación con rol status o alert | Incluir un <div role="status"> o aria-live="polite" para anunciar que la orden fue completada | Usar lector de pantalla (NVDA, VoiceOver) y verificar que el mensaje de confirmación se anuncie automáticamente. |
| 2 | Elementos visuales sin equivalentes textuales (alt faltante) | Asegurar que logos, íconos o ilustraciones tengan alt o aria-hidden="true" si son decorativos | Ejecutar WAVE o axe DevTools y revisar reportes de imágenes sin texto alternativo. |
| 3 | Contraste insuficiente en datos importantes (número de orden) | Validar contraste mínimo 4.5:1 entre texto y fondo | Usar Contrast Checker o inspección con DevTools. |
| 4 | Botón de volver o continuar sin descripción accesible | Añadir texto visible o aria-label que describa la acción: ej. "Volver a tienda" o "Seguir navegando" | Navegar con lector de pantalla y confirmar que se anuncie el propósito del botón. |
| 5 | Encabezados mal estructurados (h2 sin h1, etc.) | Mantener jerarquía semántica clara: <h1> para el título de confirmación, luego <h2>, <h3>, etc. | Usar extensión como HeadingsMap para inspeccionar la estructura. |
| 6 | Texto plano que debería estar en listas o tablas (orden resumen) | Usar listas (<ul>, <ol>) o <table> para mostrar resumen de productos, precios, totales | Verificar con lector de pantalla que los items se anuncien como estructuras, no como texto plano. |
| 7 | Elementos con foco no visibles | Asegurar que cualquier botón, link o input enfocado tenga un estilo visible (borde, sombra, etc.) | Navegar con Tab y confirmar visibilidad del foco con estilos CSS aplicados. |
| 8 | Lenguaje no definido (<html lang=""> ausente) | Agregar lang="es" (o el idioma correspondiente) al elemento <html> | Revisar etiqueta <html> y verificar idioma con DevTools o Lighthouse. |
| 9 | Resumen de compra no compatible con navegación por teclado | Asegurar que se pueda acceder y leer todo el resumen con Tab, Shift+Tab | Navegar solo con teclado y confirmar que el foco pase por todos los elementos clave. |
| 10 | Falta de mensaje de éxito persistente si la página recarga | Usar almacenamiento temporal o confirmación visible persistente incluso tras actualización/reload | Refrescar la página y confirmar que el mensaje de éxito siga presente o sea accesible desde la URL. |
🌐 Manual QA Testing Guide for WCAG 2.1 AA & Directive (EU) 2019/882 Compliance
Welcome to your accessibility testing toolkit! 🧰 As a QA Manual Tester, this guide will help you ensure websites are inclusive and meet both WCAG 2.1 Level AA and the European Accessibility Directive (EU) 2019/882. 💪🌍
🧪 Herramientas de Evaluación Manual (WCAG 2.1 Nivel AA)
🔎 WAVE – Web Accessibility Evaluation Tool
- 🧩 Extensión para Chrome/Firefox
- 🎯 Muestra comentarios visuales sobre errores de accesibilidad
- ✅ Verifica: texto alternativo, roles ARIA, estructura de encabezados, contraste de color
- 🌐 https://wave.webaim.org/
🛠️ axe DevTools by Deque
- 🧩 Extensión del navegador (DevTools)
- 📊 Escaneo completo con explicaciones y soluciones
- ✅ Compatible con WCAG 2.1 AA y personalizable
- 🌐 https://www.deque.com/axe/devtools/
🚦 Lighthouse (en Chrome)
- 🛠️ En DevTools de Chrome > pestaña "Lighthouse"
- 💡 Da una puntuación rápida y destaca mejoras clave
- ✅ Cobertura básica de accesibilidad
🧪 Accessibility Insights for Web (Microsoft)
- 🧩 Extensión para Chrome/Edge
- 🧭 Evaluación paso a paso según WCAG 2.1 AA
- ✅ Verifica navegación por teclado, etiquetas, foco visible, etc.
- 🌐 https://accessibilityinsights.io/
🧑🦯 Simulación de Tecnologías Asistivas
🗣️ Lectores de Pantalla
- 🖥️ NVDA (Windows) – Gratuito y popular
- 🍏 VoiceOver (Mac) – Incluido por defecto
- 🔍 Evalúa:
- Orden lógico de lectura
- Etiquetado de botones y formularios
- Descripción de enlaces
⌨️ Navegación solo con teclado
- 🚫 Sin ratón: prueba todo usando solo Tab, Shift+Tab, Enter y Espacio
- ✅ Asegúrate de que:
- Todos los elementos interactivos sean accesibles
- El foco sea visible siempre
- No haya trampas de teclado
🇪🇺 Pruebas para la Directiva (UE) 2019/882
Esta directiva se basa en WCAG 2.1 AA y aplica a sitios web, apps y documentos digitales.
📋 Recomendaciones extra:
- 📄 Verifica accesibilidad de PDFs descargables (PDF/UA)
- 📱 Revisa accesibilidad en dispositivos móviles
- ❗ Comprueba errores en formularios (mensajes, foco, etiquetas)
🧰 Herramienta adicional:
- 🗂️ PDF Accessibility Checker (PAC 2021) – Test para documentos PDF
- 🌐 https://www.access-for-all.ch/en/pdf-accessibility-checker.html
✅ Buenas Prácticas para QA Manual
- 📌 Crea casos de prueba alineados con cada criterio de WCAG 2.1 AA
- 📷 Documenta hallazgos con capturas, selectores y criterios relacionados
- 🔁 Comienza con herramientas automáticas, luego profundiza con tests manuales
- 🤝 Trabaja en conjunto con developers y diseñadores para resolver hallazgos
🌐 Manual QA Testing Guide for WCAG 2.1 AA & Directive (EU) 2019/882 Compliance
Welcome to your accessibility testing toolkit! 🧰
As a QA Manual Tester, this guide will help you ensure websites are inclusive and meet both WCAG 2.1 Level AA and the European Accessibility Directive (EU) 2019/882. 💪🌍
🧪 Herramientas de Evaluación Manual (WCAG 2.1 Nivel AA)
🔎 WAVE – Web Accessibility Evaluation Tool
- 🧩 Extensión para Chrome/Firefox
- 🎯 Muestra comentarios visuales sobre errores de accesibilidad
- ✅ Verifica: texto alternativo, roles ARIA, estructura de encabezados, contraste de color
- 🌐 https://wave.webaim.org/
🛠️ axe DevTools by Deque
- 🧩 Extensión del navegador (DevTools)
- 📊 Escaneo completo con explicaciones y soluciones
- ✅ Compatible con WCAG 2.1 AA y personalizable
- 🌐 https://www.deque.com/axe/devtools/
🚦 Lighthouse (en Chrome)
- 🛠️ En DevTools de Chrome > pestaña "Lighthouse"
- 💡 Da una puntuación rápida y destaca mejoras clave
- ✅ Cobertura básica de accesibilidad
🧪 Accessibility Insights for Web (Microsoft)
- 🧩 Extensión para Chrome/Edge
- 🧭 Evaluación paso a paso según WCAG 2.1 AA
- ✅ Verifica navegación por teclado, etiquetas, foco visible, etc.
- 🌐 https://accessibilityinsights.io/
🧑🦯 Simulación de Tecnologías Asistivas
🗣️ Lectores de Pantalla
- 🖥️ NVDA (Windows) – Gratuito y popular
- 🍏 VoiceOver (Mac) – Incluido por defecto
- 🔍 Evalúa:
- Orden lógico de lectura
- Etiquetado de botones y formularios
- Descripción de enlaces
⌨️ Navegación solo con teclado
- 🚫 Sin ratón: prueba todo usando solo Tab, Shift+Tab, Enter y Espacio
- ✅ Asegúrate de que:
- Todos los elementos interactivos sean accesibles
- El foco sea visible siempre
- No haya trampas de teclado
🇪🇺 Pruebas para la Directiva (UE) 2019/882
Esta directiva se basa en WCAG 2.1 AA y aplica a sitios web, apps y documentos digitales.
📋 Recomendaciones extra:
- 📄 Verifica accesibilidad de PDFs descargables (PDF/UA)
- 📱 Revisa accesibilidad en dispositivos móviles
- ❗ Comprueba errores en formularios (mensajes, foco, etiquetas)
🧰 Herramienta adicional:
- 🗂️ PDF Accessibility Checker (PAC 2021) – Test para documentos PDF
- 🌐 https://www.access-for-all.ch/en/pdf-accessibility-checker.html
📱 Herramientas para Testeo de Accesibilidad Web en Móviles
🔧 1. Accessibility Scanner (Android)
- 🧩 App oficial de Google
- 🧐 Escanea apps y sitios web móviles
- ✅ Informa sobre tamaño de botones, contraste, etiquetas, foco
- 🌐 Google Play
🍏 2. VoiceOver + Safari (iOS)
- 📲 VoiceOver es el lector de pantalla nativo en iPhone/iPad
- 🔎 Verifica si la navegación es comprensible solo con audio
- ✅ Evalúa orden de lectura, etiquetas, títulos
- 🛠️ Activa en Ajustes > Accesibilidad > VoiceOver
📱 3. TalkBack + Chrome (Android)
- 📲 TalkBack es el lector de pantalla para Android
- 🎧 Permite validar accesibilidad por audio
- ✅ Evalúa estructura semántica y etiquetas
- 🛠️ Activa en Ajustes > Accesibilidad > TalkBack
🧪 4. axe DevTools Mobile (iOS & Android)
- 💼 Profesional y muy detallado
- ✅ Usa un proxy para testear apps móviles o sitios desde tu navegador en el teléfono
- 🌐 axe DevTools Mobile
🛠️ 5. Remote Debugging (Chrome DevTools)
- 🖥️ Conecta el móvil al navegador de escritorio
- 🔍 Usa DevTools para inspeccionar elementos móviles en tiempo real
- ✅ Corre axe y Lighthouse desde tu PC en una web cargada en el celular
- 📚 Guía oficial
🔍 6. Testing Manual en Móvil
- ✋ Usa solo los dedos, sin ratón ni teclado
- ⌨️ Si es posible, conecta un teclado Bluetooth
- ✅ Evalúa foco visible, activación de elementos, accesibilidad de contenido oculto
✅ Buenas Prácticas Generales
- 📌 Crea casos de prueba alineados con cada criterio WCAG 2.1 AA
- 📷 Documenta hallazgos con capturas, selectores y criterios relacionados
- 🔁 Usa primero herramientas automáticas, luego manuales y lectores
- 🤝 Trabaja junto a desarrolladores/diseñadores desde el inicio
Mobile Extra Tips:
- 📏 Elementos táctiles mínimos: 48x48px
- 🔄 No dependas de hover
- 🧠 Usa jerarquía clara y simple